﻿<UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:Indigo.Quibbler.Controls"
	mc:Ignorable="d"
	x:Class="Indigo.Quibbler.Controls.SectionControl"
	x:Name="UserControl"
     Cursor="Hand"
	>
    <UserControl.Resources>
        <local:SectionTitleConverter x:Key="SectionTitleConverter"/>
        <local:GradientDarkShadeConverter x:Key="GradientDarkShadeConverter"/>
        <local:GradientLightShadeConverter x:Key="GradientLightShadeConverter"/>
        <local:SectionControlViewModeConverter x:Key="SectionControlViewModeConverter"/>
        <Storyboard x:Key="sbShowDetails">
            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridOverview" Storyboard.TargetProperty="(UIElement.Visibility)">
                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:01.1000000" Value="{x:Static Visibility.Hidden}"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridLayout" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:01" Value="0.5"/>
                <SplineDoubleKeyFrame KeyTime="00:00:02" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridOverview" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:01" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridDetails" Storyboard.TargetProperty="(UIElement.Visibility)">
                <DiscreteObjectKeyFrame KeyTime="00:00:00.9000000" Value="{x:Static Visibility.Visible}"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridDetails" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00.9000000" Value="0"/>
                <SplineDoubleKeyFrame KeyTime="00:00:02" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Key="sbShowOverview">
            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridDetails" Storyboard.TargetProperty="(UIElement.Visibility)">
                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="00:00:01.1000000" Value="{x:Static Visibility.Hidden}"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridLayout" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:01" Value="0.5"/>
                <SplineDoubleKeyFrame KeyTime="00:00:02" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridDetails" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:01" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridOverview" Storyboard.TargetProperty="(UIElement.Visibility)">
                <DiscreteObjectKeyFrame KeyTime="00:00:00.9000000" Value="{x:Static Visibility.Visible}"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gridOverview" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00.9000000" Value="0"/>
                <SplineDoubleKeyFrame KeyTime="00:00:02" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </UserControl.Resources>
    <Grid x:Name="gridLayout">
        <Grid x:Name="gridCategory" Width="307" Height="283" Visibility="Collapsed">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="40"/>
            </Grid.RowDefinitions>
            <Border x:Name="bdSection" BorderThickness="5" Grid.Row="0" CornerRadius="10,10,10,30" Background="White">
                <Border.BorderBrush>
                    <LinearGradientBrush EndPoint="0.93,0.925" StartPoint="0.039,0.059">
                        <GradientStop Color="#FFB2CCDB" Offset="0.174"/>
                        <GradientStop Color="#FFABC8D8" Offset="0.461"/>
                        <GradientStop Color="White" Offset="0.322"/>
                        <GradientStop Color="#FFB2CCDB" Offset="0.839"/>
                        <GradientStop Color="#FFB2CCDA" Offset="0.661"/>
                        <GradientStop Color="White" Offset="0.765"/>
                        <GradientStop Color="#FFE0E4E6" Offset="0.37"/>
                        <GradientStop Color="#FFECEEF0" Offset="0.257"/>
                        <GradientStop Color="#FFEDF7FC" Offset="0.735"/>
                        <GradientStop Color="#FFE1E9EE" Offset="0.817"/>
                    </LinearGradientBrush>
                </Border.BorderBrush>
                <!--<Border.Background>
                    <ImageBrush ImageSource="pack://application:,,/Quibbler - Universal News Reader;component/Images/SectionBackgroundBlue.png"/>
                </Border.Background>-->
                <Border BorderBrush="#FF899DA8" BorderThickness="2" Grid.Row="0" CornerRadius="5,5,5,27">
                    <Grid>
                        <Grid x:Name="gridDetails" Visibility="Hidden">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="12"/>
                                <RowDefinition Height="40"/>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="0"/>
                            </Grid.RowDefinitions>
                            <Rectangle Margin="0" Fill="White">
                                <!--<Rectangle.Fill>
                                    <LinearGradientBrush EndPoint="0.95,5.77" StartPoint="0.23,-5.066">
                                        <GradientStop Color="{Binding Category, Converter={StaticResource GradientDarkShadeConverter}, ElementName=UserControl, Mode=Default}" Offset="0"/>
                                        <GradientStop Color="{Binding Category, Converter={StaticResource GradientLightShadeConverter}, ElementName=UserControl, Mode=Default}" Offset="0.578"/>
                                        <GradientStop Color="White" Offset="0.665"/>
                                        <GradientStop Color="{Binding Category, Converter={StaticResource GradientLightShadeConverter}, ElementName=UserControl, Mode=Default}" Offset="0.765"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>-->
                            </Rectangle>
                            <Grid Background="#FFBBD8E6" Grid.Row="1" Margin="0,0,0,0">
                                <StackPanel Orientation="Horizontal" Margin="10,0,0,0" VerticalAlignment="Center">
                                    <Label HorizontalAlignment="Left" Content="" d:LayoutOverrides="Height" Foreground="Black" FontSize="21.333" FontFamily="Georgia" FontWeight="Bold" Padding="0" VerticalAlignment="Center"/>
                                    <Label HorizontalAlignment="Left" Margin="5,0,0,0" Content="{Binding Category, Converter={StaticResource SectionTitleConverter}, ElementName=UserControl, Mode=Default}" d:LayoutOverrides="Height" Foreground="Black" FontSize="21.333" FontFamily="Georgia" FontWeight="Bold" Padding="0" VerticalAlignment="Center"/>
                                </StackPanel>
                            </Grid>
                            <ListBox x:Name="lstBox" Grid.Row="2" ItemsSource="{Binding ItemSource, ElementName=UserControl, Mode=Default}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Disabled" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="5,5,5,0" IsHitTestVisible="False" BorderBrush="Transparent" Background="Transparent" BorderThickness="0">
                                <ListBox.ItemTemplate>
                                    <DataTemplate>
                                        <Border Margin="0,5,0,0">
                                            <Grid>
                                                <Image Width="7" Source="pack://application:,,/Quibbler - Universal News Reader;component/Images/bullet small.png" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5,6,0,0"/>
                                                <TextBlock Text="{Binding Headline}" TextTrimming="WordEllipsis" Foreground="Black" TextWrapping="WrapWithOverflow" FontSize="18" VerticalAlignment="Top" HorizontalAlignment="Stretch" Margin="20,0,5,0" FontFamily="Georgia" MaxHeight="50"/>
                                            </Grid>
                                        </Border>
                                    </DataTemplate>
                                </ListBox.ItemTemplate>
                            </ListBox>
                            <Label x:Name="lblContentUnavailable" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Row="2" Content="Content not Available" Foreground="Black" FontSize="24" FontFamily="Georgia" Padding="0" Visibility="Collapsed" Margin="5,-10,5,0"/>
                        </Grid>
                        <Grid x:Name="gridOverview" Visibility="Hidden">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="0.65*"/>
                                <RowDefinition Height="0.35*"/>
                            </Grid.RowDefinitions>
                            <Border BorderThickness="0,0,0,5" BorderBrush="White" Background="White">
                                <Rectangle Margin="0">
                                    <Rectangle.Fill>
                                        <LinearGradientBrush EndPoint="1,1" StartPoint="0,0">
                                            <GradientStop Color="{Binding Category, Converter={StaticResource GradientDarkShadeConverter}, ElementName=UserControl, Mode=Default}" Offset="0.278"/>
                                            <GradientStop Color="{Binding Category, Converter={StaticResource GradientLightShadeConverter}, ElementName=UserControl, Mode=Default}" Offset="1"/>
                                            <GradientStop Color="{Binding Category, Converter={StaticResource GradientLightShadeConverter}, ElementName=UserControl, Mode=Default}" Offset="0.765"/>
                                        </LinearGradientBrush>
                                    </Rectangle.Fill>
                                </Rectangle>
                            </Border>
                            <StackPanel VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="20,0,0,20">
                                <Label HorizontalAlignment="Left" Content="" d:LayoutOverrides="Height" Foreground="Black" FontSize="37.333" FontFamily="Georgia" FontWeight="Bold" Padding="0" VerticalAlignment="Center"/>
                                <Label HorizontalAlignment="Left" Content="{Binding Category, Converter={StaticResource SectionTitleConverter}, ElementName=UserControl, Mode=Default}" d:LayoutOverrides="Height" Foreground="Black" FontSize="37.333" FontFamily="Georgia" FontWeight="Bold" Padding="0" VerticalAlignment="Center" Margin="0,-10,0,0"/>
                            </StackPanel>
                        </Grid>
                    </Grid>
                </Border>
            </Border>
            <Border Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" RenderTransformOrigin="0.5,0.5"  ClipToBounds="False" Margin="0,1.5,0,0" CornerRadius="30,10,0,0">
                <Border.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#33FFFFFF" Offset="0"/>
                        <GradientStop Offset="1"/>
                    </LinearGradientBrush>
                </Border.Background>
            </Border>
        </Grid>
        <Grid x:Name="gridImage" Width="307" Height="283" Visibility="Collapsed">
            <!--<Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="0"/>
            </Grid.RowDefinitions>-->
            <StackPanel Orientation="Vertical" Grid.Row="0" VerticalAlignment="Center">
                <Image x:Name="img" HorizontalAlignment="Center" Source="pack://application:,,/Quibbler - Universal News Reader;component/Images/SectionPhotos.png"/>
                <Border Height="40" HorizontalAlignment="Stretch" RenderTransformOrigin="0.5,0.5"  ClipToBounds="False" Margin="0,1.5,0,0" CornerRadius="0">
                    <Border.Background>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#33FFFFFF" Offset="0"/>
                            <GradientStop Offset="1"/>
                        </LinearGradientBrush>
                    </Border.Background>
                </Border>
            </StackPanel>
        </Grid>
        <Grid x:Name="gridUpdated" Margin="0,0,0,40" Visibility="Collapsed">
        	<Rectangle Stroke="#FF778DEE" StrokeThickness="6" ClipToBounds="True">
        		<Rectangle.Effect>
        			<BlurEffect Radius="24"/>
        		</Rectangle.Effect>
        	</Rectangle>
        </Grid>
        
    </Grid>
</UserControl>